<!DOCTYPE html>
<html lang="en">

<head>
  <meta charset="UTF-8">
  <meta http-equiv="X-UA-Compatible" content="IE=edge">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>Document</title>
</head>

<body>

</body>
<script>

  // 传统的对象  =>  对一个或一类事物特征和行为的描述
  // 以键值对形式存在  (键名:字符串  键值:任意类型 )
  // 但是传统上只能用字符串当作键。这给它的使用带来了很大的限制。
  // 传统的对象  =>  对一个或一类事物特征和行为的描述
  // 以键值对形式存在  (键名:字符串  键值:任意类型 )

  var zhang = {
    // name:"张三",
    // age:18,
    // isStudy:true,
    // hobby:["唱歌","跳舞"],
  }

  // 是否以非字符串数据 作为键名?  => 不行(都会转化为字符串)
  var arr = [1, 2, 3];
  var o = { a: 1, b: 2 };

  zhang[100] = 100;
  zhang[true] = true;
  zhang[arr] = arr;
  zhang[o] = arr;

  console.log(zhang);

  for (var key in zhang) {
    console.log(key, typeof key);
  }



  // Map() 
  // ES6 提供了新的数据结构 Map。它类似于对象，
  // 为了解决这个问题，ES6 提供了 Map 数据结构。它类似于对象，也是键值对的集合，但是“键”的范围不限于字符串，各种类型的值（包括对象）都可以当作键。也就是说，Object 结构提供了“字符串—值”的对应，Map 结构提供了“值—值”的对应，是一种更完善的 Hash 结构实现。如果你需要“键值对”的数据结构，Map 比 Object 更合适。

  // 如何创建 map数据?
  // 通过构造函数 Map()
  var m = new Map();
  // console.log(m);

  // 如何向map数据中心  增 删 改 查 数据?
  // 借助 map相关的 属性和拓展方法

  // size          map存储数据的个数

  // set(key,val)    根据键名 设置键值 (不存在就新增 存在就更新)
  // get(key)        根据键名 获取键值 
  // delete(key)     根据键名 删除数据
  // clear()         方法清除所有成员，没有返回值。
  // has(key)        方法返回一个布尔值，表示某个键是否在当前 Map 对象之中。 


  // 设置和获取
  m.set(100, 100);   //没有就设置
  m.set(100, 200);   //有 就修改
  m.set("hello", "world");
  m.set(true, true);
  m.set(null, null);

  var fn = function () { };
  var arr = [1, 2, 3];
  var o = { a: 1, b: 2 };
  var reg = /\s/ig;
  m.set(fn, fn);
  m.set(arr, arr);
  m.set(o, o);
  m.set(reg, reg);

  // 获取
  // console.log(m.get(100));
  // console.log(m.get("hello"));
  // console.log(m.get(true));

  // console.log(m.get(fn));
  // console.log(m.get(arr));
  // console.log(m.get(o));
  // console.log(m.get(reg));

  // 删除  
  // 单删  delete(key) 根据键名删除
  // m.delete(100);
  // m.delete("hello");
  // m.delete(true);
  // m.delete(null);

  // 全删  情况
  // m.clear();

  // has() 判断存在
  console.log(m.has(100));
  console.log(m.has("hello"));
  console.log(m.has(true));
  console.log(m.has(null));
  console.log(m.has(fn));
  console.log(m.has(arr));
  console.log(m.has(o));
  console.log(m.has(reg));


  console.log(m);
  console.log(m.size);

</script>

</html>